<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>News</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<link type="text/css" rel="stylesheet" href="css/weather.css" />
	<link type="text/css" rel="stylesheet" href="../../css/pepper-grinder/jquery-ui-1.8.16.custom.css" />
	<script type="text/javascript" src="../../js/jquery.min.js"></script>
	<script type="text/javascript" src="../../js/jquery-ui-1.8.16.custom.min.js"></script>
	<script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script>
	<script type="text/javascript" src="js/weather.js"></script>
	<script language="JavaScript" type="text/JavaScript">
		var mainwidth;
		var offset1 = 450;
		var offset2 = 0;
		$(document).ready(function() {
			$(window).resize(function() {
				refresh();
			});	
			initWeather();
	
			$("div").disableSelection();

			/// 飘动
			setInterval(function() {
				if (offset1 >= mainwidth) {
					offset1 =  -580;
				}

				if (offset2 >= mainwidth) {
					 offset2 =  -580;
				}
				
				offset1 += 1.1;
				offset2 += 1;
				$("#cloud1").css("background-position", offset1 + "px 30px")
				
				$("#cloud2").css("background-position", offset2 + "px 340px")
			}, 70);

		});
		function refresh(){
			var winheight = $(window).height();
			var winwidth = $(window).width();
			mainwidth = winwidth;
			$("#bodydiv").css("height",winheight);
			$(".lineDiv2").css("height",winheight/3);
			$(".weaImg").css("height",winheight/11);
			$(".weaImg").css("width",winheight/11);

			$(".normaltext").css("font-size",winheight/40);
			$(".normaltext2").css("font-size",winheight/80);
			
		}

		
		
	</script>
</head>
<body style="background-color=transparent;width:100%;margin-left:0px;margin-top:0px;">
	<div id="bodydiv" style="background:url(images/bg2.jpg);background-position:-55px 0px;">
		<div style="position: fixed;left:5%;top:5%;width:100px;height:100px;z-index:100;" >
			<img id="weatherImg1" src="" style="width:100%;height:100%;cursor:pointer;" />
		</div>
		<div id="cloud1" class="cloud"></div>
		<div id="cloud2" class="cloud"></div>
		<div id="cityname" class="titletext" style="float:left;width:100%;height:100px;">数据加载中</div>
		<div id="datetime" class="normaltext2" style="float:left;width:100%;height:50px;"></div>
		<div class="lineDiv">
			
			<div  style="float:left;width:20%;height:30px;">
				<div id="weather1" class="normaltext"></div>
				<div class="normaltext2">天气</div>
			</div>
			<div  style="float:left;width:20%;height:30px;">
				<div id="temp1" class="normaltext"></div>
				<div class="normaltext2">温度</div>
			</div>
			<div  style="float:left;width:20%;height:30px;">
				<div id="index_uv" class="normaltext"></div>
				<div class="normaltext2">紫外线强度</div>
			</div>
			<div  style="float:left;height:30px;">
				<div id="wind1" class="normaltext"></div>
				<div class="normaltext2">风向风力</div>
			</div>
			
		</div>
		
		<div class="lineDiv2">
			<div class="weaDiv">
				<div id="datetime2" class="normaltext2 weaLineDiv" style="height:15%;"></div>
				<div class="weaLineDiv"><img id="weatherImg2" class="weaImg" src="" style="width:100%;height:100%;cursor:pointer;margin:0 auto;" /></div>
				<div id="weather2" class="normaltext2 weaLineDiv" style="padding-top:10px;"></div>
				<div id="temp2" class="normaltext2 weaLineDiv"></div>
				<div id="wind2" class="normaltext2 weaLineDiv"></div>
			</div>
			<div class="weaDiv">
				<div id="datetime3" class="normaltext2 weaLineDiv" style="height:15%;"></div>
				<div class="weaLineDiv"><img id="weatherImg3" class="weaImg" src="" style="width:100%;height:100%;cursor:pointer;margin:0 auto;" /></div>
				<div id="weather3" class="normaltext2 weaLineDiv" style="padding-top:10px;"></div>
				<div id="temp3" class="normaltext2 weaLineDiv"></div>
				<div id="wind3" class="normaltext2 weaLineDiv"></div>
			</div>
			<div class="weaDiv">
				<div id="datetime4" class="normaltext2 weaLineDiv" style="height:15%;"></div>
				<div class="weaLineDiv"><img id="weatherImg4" class="weaImg" src="" style="width:100%;height:100%;cursor:pointer;margin:0 auto;" /></div>
				<div id="weather4" class="normaltext2 weaLineDiv" style="padding-top:10px;"></div>
				<div id="temp4" class="normaltext2 weaLineDiv"></div>
				<div id="wind4" class="normaltext2 weaLineDiv"></div>
			</div>
			<div class="weaDiv">
				<div id="datetime5" class="normaltext2 weaLineDiv" style="height:15%;"></div>
				<div class="weaLineDiv"><img id="weatherImg5" class="weaImg" src="" style="width:100%;height:100%;cursor:pointer;margin:0 auto;" /></div>
				<div id="weather5" class="normaltext2 weaLineDiv" style="padding-top:10px;"></div>
				<div id="temp5" class="normaltext2 weaLineDiv"></div>
				<div id="wind5" class="normaltext2 weaLineDiv"></div>
			</div>
			<div class="weaDiv">
				<div id="datetime6" class="normaltext2 weaLineDiv" style="height:15%;"></div>
				<div class="weaLineDiv"><img id="weatherImg6" class="weaImg" src="" style="width:100%;height:100%;cursor:pointer;margin:0 auto;" /></div>
				<div id="weather6" class="normaltext2 weaLineDiv" style="padding-top:10px;"></div>
				<div id="temp6" class="normaltext2 weaLineDiv"></div>
				<div id="wind6" class="normaltext2 weaLineDiv"></div>
			</div>
		</div>

	</div>
</body>
</html>